<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>加入幻城</title>
    <link rel="icon" href="images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/join.css">
    <script src="js/jquery.min.js"></script>
</head>
<body>
<!-- 导航栏 -->
<div class="nav">
    <div class="nav_con">
        <img class="logo" src="images/logo.png" width="10%"/>
        <img class="logo_infro" src="images/logo_infro.png" width="15%"/>
        <ul class="nav_ul">
            <li class="nav_li"><a href="index.html" title="从这里开始">首页</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="about.html" title="公司简介">关于幻城</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="game.html" title="精品专区">幻城游戏</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="join.html" class="active_hover" title="招贤纳士">加入幻城</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="contact.html" title="保持联系">联系我们</a>
                <div></div>
            </li>
        </ul>
    </div>
</div>
<div class="kongbai"></div>
<!-- 导航栏结束 -->

<!-- 加入幻城 -->
<div class="game_banner"></div>
<div class="join">
    <div class="join_tab_main">
        <div class="join_tab">
            <ul>
                <li class="addBlue">运营类</li>
                <li>美术类</li>
            </ul>
        </div>
        <div class="join_tab_con">
            <ul class="father">
                <li class="li_first">
                    <ul>
                        <li class="li_li_frist">职位名称</li>
                        <li>职位类别</li>
                        <li>工作性质</li>
                        <li>工作地点</li>
                        <li>招聘人数</li>
                        <li>发布时间</li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</div>
<!-- 表格控件 -->
<script>
    $(function () {
        var data = {
            kind: ["运营类", "美术类"],
            gong: [["游戏运营", "游戏客服"], ["游戏UI", "广告设计"]],
            infro1: [["1、负责制定各种线上运营活动，深度整合游戏产品，并根据客户需求及市场需求策划专题、活动等；<br>2、负责游戏平台日常维护和管理，对客服问题进行解答、整理，收集客服汇报用户建议及产品缺陷，推动产品质量持续改善。", "1、负责在线处理用户的咨询、投诉、建议，确保信息传递的准确性和及时性，保证客户的满意度；<br>2、准确记录用户信息，按照规定的流程、标准正确记录用户的需求和建议；监控游戏运行状态，维护游戏世界的正常秩序；<br>3、及时反馈和协助处理游戏异常状况，并与玩家做好沟通。"], ["1、游戏产品界面设计、优化产品界面用户体验;<br>2、系统功能图标、道具图标等手绘。", "1、根据公司及项目组要求制作市场投放广告图;<br>2、负责公司产品的落地页、icon等各种视觉元素的设计和制作;<br>3、负责公司产品的素材创意设计。"]],
            infro2: [["1、本科及以上学历，专业不限；<br>2、有游戏运营工作经验优先，有较强的游戏感，对游戏活动策划有创意和实施经验；<br>3、对数据敏感，精通数据分析，有较强的逻辑思维能力，良好的综合协调能力，条理清晰，学习和总结能力强；<br>4、良好的沟通能力与团队协作能力，高度的工作责任心和敬业精神。", "1、大专及以上学历，专业不限；<br>2、有客服经验者优先，深入体验过至少一款游戏，熟悉游戏的系统玩法；<br>3、较好的沟通、表达、应变、协调及反应能力，较强的服务意识，较强的情绪自我控制及调节能力，能承受较强的工作压力，接受客服倒班工作性质；<br>4、良好的沟通能力与团队协作能力，高度的工作责任心和敬业精神。"], ["1、大专及以上学历，美术相关专业优先;<br>2、有游戏UI相关工作经验者优先，熟练掌握Photoshop、illustrator等图形设计软件，有较强的界面设计能力;<br>3、有优秀的审美能力，独特的创意，有较强的平面设计和网页设计创意力，能良好地把握色彩搭配;<br>4、良好的沟通能力与团队协作能力，高度的工作责任心和敬业精神。", "1、大专及以上学历，美术相关专业优先;<br>2、有相关游戏广告设计经验者优先，熟练使用Photoshop、Illustrator、flash等设计软件，美术功底扎实;<br>3、熟知移动端主流平台的设计规范，对视觉用户研究有一定的经验和见解;<br>4、良好的沟通能力与团队协作能力，高度的工作责任心和敬业精神。"]]
        }
        for (var i = 0; i < data.gong[0].length; i++) {
            $(".li_first").after("<li class='li_ohter'><ul><li class='li_li_frist'>" + data.gong[0][i] + "</li><li>" + data.kind[0] + "</li><li>全职</li><li>长春市</li><li>若干</li><li style='position: relative;'>0000-0-00 <img src='./images/joindown.png' style='position: absolute;left: 120px;top: 18px;width: 25%;'></li></ul><li class='content'><div class='content_div'><div class='c_d_title'>岗位职责：</div><div class='c_d_font'>" + data.infro1[0][i] + "</div><div class='c_d_title'>任职要求：</div><div class='c_d_font'>" + data.infro2[0][i] + "</div><div class='c_d_btn'>简历投递邮箱：hr@yeahworld.com</div></div></li>");
        }

        console.log(data);

        function play() {
        };
        play.prototype = {
            NavHover: function () {
                $(".nav_li").hover(function () {
                    $(this).find('div').stop().animate({"width": "100%"}, 300);
                }, function () {
                    $(this).find('div').stop().animate({"width": "0px"}, 200);
                });
            },
            Background: function (a, b, c) {
                $(a).removeClass(b);
                $(c).addClass(b);
            },
            init: function () {
                $(".content").css("height", "0px");
                $(".content_div,.content").hide();
            },
            Tab: function (a, b) {
                var turn = 1;
                $(document).on("click", a, function () {
                    Play.Background(a, b, this);
                    if (a == ".join_tab_con .father .li_ohter") {
                        if (turn == 1) {
                            Play.init();
                            $(this).find("img").attr("src", "./images/joinup.png");
                            if ($(this).next().css("height") < "2px") {
                                $(this).next().animate({"height": "480px"}, 200);
                                $(this).next().show();
                                $(this).next().find(".content_div").show();
                            }
                            turn = 0;
                        } else {
                            Play.init();
                            $(a).find("img").attr("src", "./images/joindown.png");
                            turn = 1;
                        }
                    } else {
                        $(".li_ohter").remove();
                        Play.init();
                        var index = $(this).index();
                        for (var i = 0; i < data.gong[index].length; i++) {
                            $(".li_first").after("<li class='li_ohter'><ul><li class='li_li_frist'>" + data.gong[index][i] + "</li><li>" + data.kind[index] + "</li><li>全职</li><li>长春市</li><li>若干</li><li style='position: relative;'>0000-0-00 <img src='./images/joindown.png' style='position: absolute;left: 120px;top: 18px;width: 25%;'></li></ul><li class='content'><div class='content_div'><div class='c_d_title'>岗位职责：</div><div class='c_d_font'>" + data.infro1[index][i] + "</div><div class='c_d_title'>任职要求：</div><div class='c_d_font'>" + data.infro2[index][i] + "</div><div class='c_d_btn'>简历投递邮箱：hr@yeahworld.com</div></div></li>");
                        }
                    }
                });
            }
        }
        var Play = new play()
        Play.NavHover();
        Play.Tab(".join_tab_con .father .li_ohter", "addF2FBFF");
        Play.Tab(".join_tab ul li", "addBlue");

    })
</script>
<!-- 加入幻城结束 -->

<!-- 右侧漂浮 -->
<div class="rightfix">
    <dl>
        <dd>
            <a class="kefu"></a>
        </dd>
        <dd>
            <a class="back_top"></a>
        </dd>
    </dl>
</div>
<script>
    $(".back_top").hide();
    $(function () {
        $(window).scroll(function () {
            if ($(window).scrollTop() > 100) {
                $(".back_top").fadeIn(200);
            }
            else {
                $(".back_top").fadeOut(200);
            }
        });

        $(".back_top").click(function () {
            $('body,html').animate({scrollTop: 0}, 500);
            return false;
        });
    });
</script>
<!-- 遮罩层 -->
<div id="goodcover"></div>
<!-- 弹出框 -->
<div id="code">
    <div class="header">
        <div class="close1" style="margin: 10px 10px 0 0;"><a href="javascript:void(0)" id="closebt"><img src="images/close.png"></a></div>
    </div>
    <div class="header1">
        <div class="goodtxt">
            <p>微信扫一扫</p>
            <p>添加博乐官方微信</p>
            <p>了解更多游戏相关</p>
        </div>
        <div class="code-img"> <img id="ewmsrc"  src="images/code.jpg"/></div>
    </div>
    <div class="header2">
        <div class="goodtxt">
            <p>微信扫一扫</p>
            <p>添加博乐官方微信客服</p>
            <p>了解更多游戏相关~</p>
        </div>
        <div class="code-img"> <img id="ewmsrc1"  src="images/code.jpg"/></div>
    </div>
</div>
<script>
    $(function () {
        //alert($(window).height());
        $('.kefu').click(function () {
            $('#code').center();
            $('#goodcover').show();
            $('#code').fadeIn();
        });
        $('#closebt').click(function () {
            $('#code').hide();
            $('#goodcover').hide();
        });
        $('#goodcover').click(function () {
            $('#code').hide();
            $('#goodcover').hide();
        })
        jQuery.fn.center = function (loaded) {
            var obj = this;
            body_width = parseInt($(window).width());
            body_height = parseInt($(window).height());
            block_width = parseInt(obj.width());
            block_height = parseInt(obj.height());

            left_position = parseInt((body_width / 2) - (block_width / 2) + $(window).scrollLeft());
            if (body_width < block_width) {
                left_position = 0 + $(window).scrollLeft();
            }
            ;

            top_position = parseInt((body_height / 2) - (block_height / 2) + $(window).scrollTop());
            if (body_height < block_height) {
                top_position = 0 + $(window).scrollTop();
            }
            ;

            if (!loaded) {

                obj.css({
                    'position': 'absolute'
                });
                obj.css({
                    'top': ($(window).height() - $('#code').height()) * 0.5,
                    'left': left_position
                });
                $(window).bind('resize', function () {
                    obj.center(!loaded);
                });
                $(window).bind('scroll', function () {
                    obj.center(!loaded);
                });

            } else {
                obj.stop();
                obj.css({
                    'position': 'absolute'
                });
                obj.animate({
                    'top': top_position
                }, 200, 'linear');
            }
        }

    })
</script>
<!-- 右侧漂浮 end -->

<!-- 联系我们 -->
<div class="contact_us">
    <div class="contact_con">
        <div class="con_list c_c_one">
            <div class="con_list_title">联系我们</div>
            <div class="c_l_wx">
                <img src="images/wx.png"/>
                <div class="wx_font">关注官方微信<br>获得更多资讯</div>
                <img class="wx_img" src="images/ewm1.jpg"/>
            </div>
            <div class="c_l_wx c_l_wb">
                <img src="images/wx.png"/>
                <div class="wx_font">关注官方客服<br>获得更多资讯</div>
                <img class="wx_img2" src="images/ewm2.jpg">
            </div>
        </div>
        <div class="con_list c_c_two">
            <div class="c_c_t_con">
                <img src="images/mail.png"/>
                <div class="c_mail">E-mail：advice@yeahworld.com</div>
            </div>
            <div class="c_c_t_con c_c_address">
                <img src="images/address.png"/>
                <div class="c_mail">地址：吉林省长春市人民大街7088号伟峰国际702室</div>
            </div>
        </div>
    </div>
</div>
<!-- 联系我们结束 -->

<!-- 页脚 -->
<div class="footer">
    <div class="footer_con">
        <div class="foote_logo">
            <img src="images/logo.png"/>
        </div>
        <div class="footer_font">
            <ul>
                <li><a href="about.html" target="_blank">关于幻城 </a><span class="np">|</span> <a href=""
                                                                                               target="_blank"></a>服务协议<span
                        class="np">|</span> <a href="join.html" target="_blank">加入我们</a><span class="np">|</span> <a
                        href="contact.html" target="_blank">联系我们</a></li>
                <li>吉林幻城科技有限公司 版权所有 吉网文 【2017】 1133-004号 吉ICP备17000914号-1</li>
                <li>ICP：吉B2-20170047</li>
            </ul>
        </div>
    </div>
</div>
<!-- 页脚结束 -->

<!-- 满屏蒲公英动效 -->
<div class="snow-container" style="position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10000;"></div>
<script src="js/jquery-pugongying.min.js"></script>
<script type="text/javascript" src="all.js"></script>
<!-- 满屏蒲公英动效 end -->
</body>
</html>
